var panels = new Array();
var panelsPreId = new Array();

function onResize(panelId) {
	console.log(panelId);
	var panel = document.getElementById(panelId);
	console.log(panel.style.left);

}

function onDrop(panelId) {
	console.log(panelId);

}

function onDrop()

{
	alert('drop');
}

function setPanel(panel, preId) {
	console.log('setPanel');
	console.log(panels);
	console.log(panel);
	panels[panel.viewName] = panel;

	panelsPreId[panel.viewName] = preId;
	console.log(panel.viewName);
	console.log(panels);
	console.log(panelsPreId);
	// console.log(panels);
	// console.log(panelsPreId);
}

function panelDrop(event, ui) {

	console.log('drop');
	var draggable = ui.draggable, // draggable element, a jQuery object
	helper = ui.helper, // helper element of draggable, a jQuery object
	position = ui.position, // position of draggable helper
	offset = ui.offset; // absolute position of draggable helper
	if(draggable.context.attributes.id == undefined)
		return;	/*
	 * console.log(position); console.log(offset); console.log(helper);
	 * console.log(draggable); console.log(draggable.context.attributes.id);
	 */
	var dropedPanel = null;
	console.log(panels);
	for ( var panelName in panels) {
		console.log(panelName);
		if (panelsPreId[panelName] == draggable.context.attributes.id.nodeValue) {
			panels[panelName].x = parseInt(position.left);
			panels[panelName].y = parseInt(position.top);
			panels[panelName].droped = true;
			dropedPanel = panels[panelName];

			console.log('find');
			console.log(panels[panelName].viewName);
		} else {
			panels[panelName].droped = false;
		}
	}

	/*
	 * panels.sort(function(a,aa){console.log('ddd'); return 0;});
	 * panelsPreId.sort(function(a,aa){console.log('ddd'); return 0;});
	 * 
	 * console.log(panels.sort(panelsComparator));
	 */
	console.log('panels: ' + panels);
	console.log('sortKeys(panels): ' + sortKeys(panels));

	var sortedKeys = sortKeys(panels);
	console.log('After sort');
	breakOverlapping(sortedKeys);

	for ( var panelName in panels) {
		DesktopRemoteBean.setPanel(panels[panelName], function() {
		});
	}
	DesktopRemoteBean.savePanelsStructure(function() {
	});
	/*
	 * var myArray = new Array(333,5,44,2222,11111); console.log(myArray);
	 * myArray.sort(compareNumbers); console.log(myArray);
	 * 
	 * for(var panelName in panels) {
	 * 
	 * if(panels[panelName].viewName != dropedPanel.viewName) {
	 * if(isCollision(panels[panelName],dropedPanel)) { console.log('COLLID' +
	 * panels[panelName].viewName );
	 * 
	 * document.getElementById(panelsPreId[panelName]).style.left="444px";
	 * panels[panelName].a = "b"; console.log(panels[panelName]); } else {
	 * console.log('no Colision'); } }
	 *  }
	 */
}

function breakOverLapp() {
	console.log('before');
	console.log(panels);
	var count = 0;
	for ( var panelName in panels) {
		count++;
	}
	console.log(panels.length);
	console.log(count);
	if (count > 0) {
		var sortedKeys = sortKeys(panels);
		
		console.log('breakOveLapp');
		breakOverlapping(sortedKeys);
		for ( var panelName in panels) {
			DesktopRemoteBean.setPanel(panels[panelName], function() {
			});
		}
		DesktopRemoteBean.savePanelsStructure(function() {
		});
	}
}

function breakOverlapping(sortedKeys) {
	var key = sortedKeys.splice(0, 1); /* remove key */
	/*
	 * panels[key].x =
	 * parseInt(document.getElementById(panelsPreId[key]).style.left.substring(0,document.getElementById(panelsPreId[key]).style.left.length
	 * -2)); panels[key].y =
	 * parseInt(document.getElementById(panelsPreId[key]).style.top.substring(0,document.getElementById(panelsPreId[key]).style.top.length
	 * -2));
	 */
	console.log(key + ' kx: ' + panels[key].x + ' kY: ' + panels[key].y);
	for ( var pni in sortedKeys) {
		var pn = sortedKeys[pni];
		if (isCollision(panels[key], panels[pn])) {

			/*
			 * panels[pn].x =
			 * parseInt(document.getElementById(panelsPreId[pn]).style.left.substring(0,document.getElementById(panelsPreId[key]).style.left.length
			 * -2)); panels[pn].y =
			 * parseInt(document.getElementById(panelsPreId[pn]).style.top.substring(0,document.getElementById(panelsPreId[key]).style.top.length
			 * -2));
			 */
			console.log(pn + ' x: ' + panels[pn].x + ' Y: ' + panels[pn].y);
			var diffY = panels[key].height - (panels[pn].y - panels[key].y);
			var diffX = panels[key].width - (panels[pn].x - panels[key].x);
			if (diffX < diffY) {
				var left = panels[pn].x;
				console.log(left);
				left += diffX + 7;
				panels[pn].x = left;
				console.log(left);
				document.getElementById(panelsPreId[pn]).style.left = left
						+ "px";
			} else {
				var top = panels[pn].y;
				console.log(top);
				top += diffY + 7;
				panels[pn].y = top;
				console.log(top);
				document.getElementById(panelsPreId[pn]).style.top = top + "px";
			}

		}
	}
	sortedKeys.sort(panelsComparator);
	if (sortedKeys.length >= 2)
		breakOverlapping(sortedKeys);

}

function sortKeys(arr) {
	// Setup Arrays
	console.log(arr);
	var sortedKeys = new Array();

	// Separate keys and sort them
	for ( var i in arr) {
		sortedKeys.push(i);
	}
	sortedKeys.sort(panelsComparator);

	return sortedKeys;
}

function compareNumbers(a, b) {
	console.log('a');
	return a - b;
}

function panelsComparator(pn1, pn2) {
	/* console.log('compare' + pn1 + ' ' + pn2); */
	var p1 = panels[pn1];
	var p2 = panels[pn2];
	if (p1.y < p2.y)
		return -1;
	else {
		if (p1.y == p2.y) {
			console.log(p1.y + ' ' + p2.y);
			if (p1.x < p2.x)
				return -1;
			else {
				if (p1.x == p2.x) {
					if (p1.droped)
						return -1;
					if (p2.droped)
						return 1;
					return 0;
				}
			}

		}
	}
	return 1;
}

/**
 * czy 2 panele koliduja
 * 
 * @param p1,
 *            p2
 * @returns
 */
function isCollision(p1, p2) {
	/*
	 * console.log(p1); console.log(p2); console.log(p2.x > p1.x + p1.width );
	 * console.log(p2.y > p1.y + p1.height); console.log(p1.x > p2.x +
	 * p2.width); console.log(p1.y > p2.y + p2.height);
	 */
	if (p2.x > p1.x + p1.width || p2.y > p1.y + p1.height
			|| p1.x > p2.x + p2.width || p1.y > p2.y + p2.height)
		return false;
	else
		return true;
}

/**
 * czy x,y rzucenogo prostokata zawiera sie w innym
 * 
 * @param dropedPanel
 * @returns
 */
/*
 * function isXYcollision(dropedPanel) { var collision = false; for(var panel in
 * panels){ if(panel.viewName != dropedPanel.viewName) {
 * 
 * collision = true; } } return collision; }
 */

